<style scoped>
.doclist .shark {
    padding: 0 30px;
}

.doclist .fast {
    font-size: 20px;
    color: #f39312;
    letter-spacing: 1px;
}

.doclist .main .ivu-select,
.main .ivu-input {
    border-radius: 0 2px 2px 0;
}

.doclist .common-box-body {
    padding-top: 24px;
}
.doclist .fixed-bottom {
    padding-left: 30px;
    padding-right: 40px;
    height: 80px;
    line-height: normal !important;
    position: fixed;
    left: 210px;
    right: 0;
    bottom: 0;
    z-index: 999;
    text-align: center;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.28);
}
.doclist .sidehide {
    left: 75px;
}
.doclist .detail {
    margin-top: 20px;
    margin-bottom: 15px !important;
}
</style>
<style>
.doclist
    .common-box-body
    .ivu-select-single
    .ivu-select-selection
    .ivu-select-placeholder,
.common-box-body
    .ivu-select-single
    .ivu-select-selection
    .ivu-select-selected-value {
    padding-right: 0px;
}

.doclist .ivu-tabs.ivu-tabs-card > .ivu-tabs-bar .ivu-tabs-tab {
    color: #2d8cf0;
    border-color: transparent;
    background-color: #fff;
}

.doclist .ivu-tabs.ivu-tabs-card > .ivu-tabs-bar .ivu-tabs-tab-active {
    color: #808080;
    border: 1px solid #dddee1;
    border-bottom: 0;
}
.doclist button.ivu-btn {
    border-radius: 2px !important;
}
</style>


<template>
    <div class="doclist">
        <product-title></product-title>
        <div class="shark" style="padding:0 30px;">
            <div class="fast">快速搜索</div>
            <div class="common-box-body">
                <Form>
                    <Row>
                        <Col :md="24" :lg="4">
                        <FormItem>
                            <Input placeholder="请输入保单号码" v-model="formdata.insuranceNo"></Input>
                        </FormItem>
                        </Col>

                        <Col :md="24" :lg="4">
                        <FormItem>
                            <DatePicker type="date" placeholder="请选择日期" v-model="receivedDate" @on-change="datachange($event,formdata,'receivedDate')"></DatePicker>
                        </FormItem>
                        </Col>

                        <Col :md="24" :lg="{span:4,offset:12}">
                        <Button size="large" class="fr" type="primary" icon="ios-search" @click="search">搜索</Button>
                        </Col>
                    </Row>
                    <div style="border-bottom:1px solid #BEBEBE;"></div>
                    <Row style="margin-top:20px;">
                        <Col span="24" class="table-action">
                        <div class="fr">
                            <Upload action="" :format="['xlsx']" name="file_input" :before-upload="handleUploadWl">
                                <Button type="info" size="large" class="fr" icon="icon iconfont icon-daoru">导入清单</Button>
                            </Upload>
                        </div>
                        <div style="border-right: 1px solid #EDF2F6;padding-right:15px;" class="fr">
                            <a href="https://192.168.0.10:82/kb/v1/excel/download/实收清单下载模板.xlsx">
                                <Button type="info" size="large" class="fr" icon="icon iconfont icon-daochu">实收清单模板下载</Button>
                            </a>
                        </div>
                        </Col>
                    </Row>
                </Form>
            </div>
            <div class="detail">
                <div class="clearfix">
                    <div class="table-theme highlight_table">
                        <Table ref="currentRowTable" size="large" stripe border :columns="columns1" :data="tableList" class=""></Table>
                    </div>
                </div>
            </div>
            <div :class="slidetoggle?'fixed-bottom':'fixed-bottom sidehide' ">
                <Row class="pro-pagesize">
                    <Col :md="24" :lg="24" class="tRight">
                    <Page :total="totals" ref='pages' :current="currentpage" show-total show-sizer :page-size="pagesize" @on-change="pageChange" @on-page-size-change="pageSizeChange" placement="top" class="page"></Page>
                    </Col>
                </Row>
            </div>
        </div>
    </div>
</template>

<script>
import productTitle from "../../components/productTitle";
import util from "../../libs/util.js";
export default {
    data() {
        return {
            tableList: [],
            p: 1, //对页面页数的定义-->初始化
            pagesize: 10, //对页面的定义,出事定义10条数据
            totals: 0,
            currentpage: 1,
            receivedDate: "",
            formdata: {
                p: 1, //对页面页数的定义-->初始化
                pagesize: 10, //对页面的定义,出事定义10条数据
                insuranceNo: "",
                receivedDate: ""
            },
            columns1: [
                {
                    type: "index",
                    width: 80,
                    align: "center"
                },
                {
                    title: "保单号码",
                    key: "insuranceNo",
                    align: "center"
                },
                {
                    title: "实收日期",
                    key: "receivedDate",
                    align: "center"
                }
            ],
            current: {}
        };
    },
    components: {
        productTitle
    },
    computed: {
        slidetoggle() {
            return this.$store.state.sildeshow;
        }
    },
    mounted() {
        this.getList();
    },
    methods: {
        //时间转换
        datachange(date, obj, param) {
            obj[param] = date;
        },//时间转换
        datachange(date, obj, param) {
            obj[param] = date;
        },
        //上传之前
        handleUploadWl(file) {
            var _this = this;
            let param = new FormData();
            param.append("file", file);
            var url = BASE_URL1 + "/kb/v1/excel/import"; 
            util.ajax
                .post(url, param, {
                    headers: { "Content-Type": "multipart/form-data" }
                })
                .then(function(res) {
                    if (res.data.code == 0) {
                        _this.$Message.success(res.data.info);
                        _this.formdata.p = 1;
                        _this.p = 1;
                        _this.getList();
                    } else {
                        _this.$Message.error(res.data.info);
                    }

                })
                .catch(res => {});
            return false;
        },
        //获取页面信息getList
        getList() {
            var _this = this;
            var url = BASE_URL1 + "/kb/v1/find/shiShou"; 
            util.ajax
                .get(url, {
                    params: _this.formdata
                })
                .then(function(res) {
                    if (res.data.code == 0) {
                        _this.totals = res.data.data.total;
                        _this.tableList = res.data.data.dataList;
                    } else {
                        _this.$Message.error(res.data.info);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        // 页码改变
        pageChange(p) {
            this.p = p;
            this.formdata.p = p;
            this.getList();
        },
        // 每页条数改变
        pageSizeChange(pagesize) {
            this.pagesize = pagesize;
            this.formdata.pagesize = pagesize;
            this.getList();
        },
        /**@augments
         *
         */
        // 点击搜索,进行数据搜索
        search() {
            this.p = 1;
            this.formdata.p = 1;
            this.getList();
        }
    }
};
</script>